<template>
	<view class="work-experience">
		<cu-custom isBack="true"></cu-custom>
		<header-title>
			<block slot="title">编辑工作经历</block>
			<block slot="info">从最近一份工所写起哦</block>
		</header-title>

		<view class="education-body">
			<education-item>
				<block slot="title">公司名称</block>
				<input slot="from" v-model="workInfo.work_name" class="input" placeholder-class="input-placeholder"
					placeholder="请填写您入职过的公司" />
			</education-item>

			<education-item>
				<block slot="title">时间段</block>
				<input @click="showPickHandle" slot="from" class="input arrow" disabled="true"
					placeholder-class="input-placeholder" placeholder="请选择时间段" :value="timeSlotArr" />
			</education-item>

			<education-item>
				<block slot="title">职位类型</block>
				<input slot="from" v-model="workInfo.work_position" class="input" placeholder-class="input-placeholder"
					placeholder="请填写您的职位类型" />
			</education-item>


			<education-item>
				<block slot="title">工作内容</block>
				<input @click="setJobContentHandle" slot="from" class="input arrow" disabled="true"
					placeholder-class="input-placeholder" placeholder="请填写工作内容" :value="workInfo.work_about" />
			</education-item>

			<education-item>
				<block slot="title">工作业绩</block>
				<input @click="setPerformanceHandle" slot="from" class="input arrow" disabled="true"
					placeholder-class="input-placeholder" placeholder="请填写工作业绩" :value="workInfo.work_achievement" />
			</education-item>

			<footer-btn @submit="nextClickHandle">
				<text slot="text">
					<block v-if="pageType=='add'">
						下一步
					</block>
					<block v-if="pageType=='update'">
						确认
					</block>
				</text>
			</footer-btn>

			<rangeDatePick :show="isShowPick" @showchange="hidePickHandle" :start="startTime" :end="endTime"
				:value="workInfo.work_time" @change="pickChange" @cancel="hidePickHandle" fields="month">
			</rangeDatePick>
		</view>
	</view>
</template>

<script>
	import headerTitle from '../../components/header-title/header-title.vue';
	import educationItem from '../../components/education-item/education-item.vue';
	import rangeDatePick from '@/components/pyh-rdtpicker/pyh-rdtpicker.vue';
	import footerBtn from '../../components/footer-btn/footer-btn.vue';
	export default {
		components: {
			headerTitle,
			educationItem,
			rangeDatePick,
			footerBtn
		},
		data() {
			return {
				workInfo: {
					work_name: '',
					work_position: '',
					work_time: Array(2).fill(this.$comm.formatDate("YYYY-MM")),
					work_about: '',
					work_achievement: ''
				},
				startTime: this.$comm.formatDate("YYYY-MM", this.$comm.getDateByYear(-20)),
				endTime: this.$comm.formatDate("YYYY-MM", this.$comm.getDateByYear()),
				isShowPick: false,
				pageType: 'add'
			};
		},
		onLoad(option) {
			let {
				pageType = 'add'
			} = option
			if (pageType == 'update') {
				let workInfo = this.$store.getters['update/getWorkInfoData']
				this.workInfo = Object.assign(this.workInfo, workInfo)
			}
			this.pageType = pageType
		},
		computed: {
			timeSlotArr() {
				return this.workInfo.work_time.join(" 至 ")
			}
		},
		methods: {
			showPickHandle() {
				this.isShowPick = true
			},
			hidePickHandle() {
				this.isShowPick = false
			},
			pickChange(e) {
				this.workInfo.work_time = e
			},
			setJobContentHandle() {
				this.$comm.navigateTo(`/pages/work-content/work-content?val=${this.workInfo.work_about}`)
				uni.$once('setContent', (e) => {
					this.workInfo.work_about = e
				})
			},
			setPerformanceHandle() {
				this.$comm.navigateTo(`/pages/work-performance/work-performance?val=${this.workInfo.work_achievement}`)
				uni.$once('setContent', (e) => {
					this.workInfo.work_achievement = e
				})
			},
			nextClickHandle() {
				let workInfo = JSON.parse(JSON.stringify(this.workInfo))
				let valLoginRes = this.$validate.validate(workInfo, [{
					name: 'work_name',
					type: 'required',
					errmsg: '公司名称不能为空'
				}, {
					name: 'work_position',
					type: 'required',
					errmsg: '职位类型不能为空'
				}, {
					name: 'work_time',
					type: 'arrlength',
					errmsg: '工作时间段不能为空'
				}, {
					name: 'work_about',
					type: 'required',
					errmsg: '工作内容不能为空'
				}, {
					name: 'work_achievement',
					type: 'required',
					errmsg: '工作业绩不能为空'
				}])
				if (!valLoginRes.isOk) {
					this.$comm.errorToShow(valLoginRes.errmsg)
					return false
				}
				if (this.pageType == 'update') {
					this.$comm.navigateBack(1,()=>{
						uni.$emit('updateWorkInfo', workInfo)
					})
				} else if (this.pageType == 'add') {
					this.$store.commit('add/setWorkInfoData', [workInfo])
					this.$comm.redirectTo("/pages/project-experience/project-experience")
				}
			}
		}
	}
</script>

<style lang="scss">
	.input-placeholder {
		color: $font-cA7;
		font-size: 42upx;
	}

	.work-experience {
		@include formStyle;
	}
</style>
